
<link href="../../../css/faculty/profile.css" rel="stylesheet" type="text/css" />
<div class="container-fluid">
	<div class="row-fluid">
        <?php echo form_open('faculty/edit_member', array('id' => "edit_profile", 'enctype' => 'multipart/form-data'));?>
            <div class="span3 row-fluid">
                <!--<img alt="140x140" src="http://lorempixel.com/140/140/" />-->
               <center>
                <br/>
                <br/>
                <?php
                $file = $base_url."img/members/".$profileID.".jpg   ";
                $file_headers = @get_headers($file);
                if($file_headers[0] == 'HTTP/1.1 404 Not Found') {
                    echo '<img id="img_profile" alt="140x140"  src="'.$base_url.'img/members/blank.png"/>';
                }
                else {
                    echo '<img id="img_profile" alt="140x140" src="'.$base_url.'img/members/'.$profileID.'.jpg"/>';
                }

                ?>
                <h3>
                    <span class="user-last-name"><?php echo $profileLastName?></span>,
                    <span class="user-first-name"><?php echo $profileFirstName?></span>
                    <span class="user-middle-name"><?php echo $profileMiddleName?></span>
                </h3>
               </center>

                    <label for="upload_photo" class="btn" id="lbl_input_upload">Upload new photo</label>
                    <p id="p_filename">No File Selected Yet</p>
                    <?php echo form_upload(array('id' => 'upload_photo', 'name' => 'upload_photo', 'style' => "opacity:0;")) ?>

            </div>
            <div class="span9">
                <div class="tabbable">
                    <ul class="nav nav-tabs">
                        <li class="active">
                            <a href="#basic" data-toggle="tab">Profile</a>
                        </li>
                        <?php if($user_id == $profileID)
                            echo
                            '<div id="controls" class="pull-right">
                                <a id = "edit" class = "btn btn-primary" >Edit Information</a>
                                <a id = "save_edit" class = "btn btn-primary" >Save Edit</a>
                                <a id = "cancel_edit" class = "btn" >Cancel</a>
                            </div>';
                        ?>

                    </ul>
                    <div class="tab-content" style="background-color: rgba(0, 0, 0, 0.7); border-radius: 25px;">
                        <div class="tab-pane active" id="basic" style="margin-left: 30px">
                            <!-- Public -->
                            <div style="font-family:Georgia; font-size:18px; font-weight:bold">
                            <h3 style=" color:wheat">Basic Information </h3>
                                <div class="profile">
                                     <div class="row-fluid">
                                         <div class="span3">First Name: </div>
                                         <div class="span9">
                                             <div id="div_first_name"><?php echo $profileFirstName?></div>
                                            <input type="text" id="edit_fname" name="edit_fname" value="<?php echo $profileFirstName?>">
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Middle Name:</div>
                                         <div class="span9">
                                             <div id="div_middle_name"><?php echo $profileMiddleName?></div>
                                             <input type="text" id="edit_mname" name="edit_mname" value="<?php echo $profileMiddleName?>">
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Last Name:</div>
                                         <div class="span9"><div id="div_last_name"> <?php echo $profileLastName?></div>
                                            <input type="text" id="edit_lname" name="edit_lname" value="<?php echo $profileLastName?>">
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Birthdate:</div>
                                         <div class="span9"><div id="div_birthdate"><?php echo $profileBirthDate?></div>
                                            <input type="text" id="edit_birthdate" name="edit_birthdate" value="<?php echo $profileBirthDate?>">
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Address: </div>
                                         <div class="span9"><div id="div_address"> <?php echo $profileAddress?></div>
                                            <input type="text" id="edit_address" name="edit_address" value="<?php echo $profileAddress?>">
                                        </div>
                                    </div>

                                     <h3 style="color:wheat"> Academic Information </h3>

                                     <div class="row-fluid">
                                         <div class="span3">Status:  </div>
                                         <div class="span9"><div id="div_status"><?php echo $profileStatus?></div>
                                             <select id="edit_status" name="edit_status">
                                                 <?php
                                                 foreach ($tblStatus as $row) {
                                                     $selected = '';
                                                     if($profileStatus == $row['Description'])
                                                         $selected = 'selected';
                                                     echo '<option value="'.$row['ID'].'" '.$selected.'>
                                                                '.$row['Description'].'
                                                           </option>';
                                                 }
                                                 ?>
                                             </select>
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Highest Degree/s:</div>
                                         <div class="span9"><div id="div_degree"><?php echo $profileDegree?></div>
                                             <select id="edit_degree" name="edit_degree">
                                                 <?php
                                                 foreach($tblDegree as $row)
                                                 {
                                                     $selected = '';
                                                     if($profileDegree == $row['Description'])
                                                         $selected = 'selected';
                                                     echo '<option value="'.$row['ID'].'" '.$selected.'>
                                                                '.$row['Description'].'
                                                           </option>';
                                                 }
                                                 ?>
                                             </select>
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Rank:</div>
                                         <div class="span9">
                                             <div id="div_rank"> <?php echo $profileRank?></div>
                                             <select id="edit_rank" name="edit_rank">
                                                 <?php
                                                 foreach ($tblRank as $row) {
                                                     $selected = '';
                                                     if($profileRank == $row['Description'])
                                                         $selected = 'selected';
                                                     echo '<option value="'.$row['ID'].'" '.$selected.'>
                                                                '.$row['Description'].'
                                                           </option>';

                                                 }
                                                 ?>
                                             </select>
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                         <div class="span3">Department: </div>
                                         <div class="span9">
                                             <div id="div_department"><?php echo $profileDepartment?> </div>
                                             <select id="edit_department" name="edit_department">
                                                 <?php
                                                 foreach ($tblDepartment as $row) {
                                                     $selected = '';
                                                     if($profileDepartment == $row['Description'])
                                                         $selected = 'selected';
                                                     echo '<option value="'.$row['DeptID'].'" '.$selected.'>
                                                         '.$row['Description'].'
                                                     </option>';

                                                 }
                                                 ?>
                                             </select>
                                         </div>
                                     </div>

                                     <div class="row-fluid">
                                        <div class="span3">Specialization  </div>
                                        <div class="span9"><div id="div_specialization"><?php echo $profileSpecialty?></div></div>
                                        <input type="hidden" id="edit_special" name="edit_special" value="<?php echo $profileSpecialty?>">
                                     </div>

                                </div>
                                <!--Profile-->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

<br/>
<script type="text/javascript">

    jQuery.noConflict();

    $(function(){

        $('#edit_birthdate').datepicker();

        showMain();
        hideEdit();
    });

    function hideEdit(){
        $('#save_edit').hide(0);
        $('#cancel_edit').hide(0);

        $('#lbl_input_upload').    hide(0);
        $('#p_filename').    hide(0);
        $('#edit_fname').    hide(0);
        $('#edit_mname').    hide(0);
        $('#edit_lname').    hide(0);
        $('#edit_birthdate').hide(0);
        $('#edit_address').  hide(0);
        $('#edit_status').   hide(0);
        $('#edit_rank').     hide(0);
        $('#edit_department').     hide(0);
        $('#edit_degree').     hide(0);


    }
    function showEdit(){
        $('#save_edit').show(0);
        $('#cancel_edit').show(0);

        $('#lbl_input_upload').    show(0);
        $('#p_filename').    show(0);
        $('#edit_fname').    show(0);
        $('#edit_mname').    show(0);
        $('#edit_lname').    show(0);
        $('#edit_birthdate').show(0);
        $('#edit_address').  show(0);
        $('#edit_status').   show(0);
        $('#edit_rank').     show(0);
        $('#edit_department').     show(0);
        $('#edit_degree').     show(0);

    }
    function hideMain(){
        $('#edit').hide(0);

        $('#div_first_name'). hide(0);
        $('#div_middle_name').hide(0);
        $('#div_last_name').  hide(0);
        $('#div_birthdate').  hide(0);
        $('#div_address').    hide(0);
        $('#div_status').     hide(0);
        $('#div_rank').       hide(0);
        $('#div_department').       hide(0);
        $('#div_degree').       hide(0);

    }
    function showMain(){
        $('#edit'). show(0);

        $('#div_first_name'). show(0);
        $('#div_middle_name').show(0);
        $('#div_last_name').  show(0);
        $('#div_birthdate').  show(0);
        $('#div_address').    show(0);
        $('#div_status').     show(0);
        $('#div_rank').       show(0);
        $('#div_department').       show(0);
        $('#div_degree').       show(0);

    }

    $('#edit').click(
        function(event)
        {
            showEdit();
            hideMain();
        }
    );

    $('#cancel_edit').click(
        function(event)
        {
            showMain();
            hideEdit();
        }
    );

    $('#save_edit').click(
        function(event)
        {
            $('#edit_profile').submit();
        }
    );

    $('#edit_profile').on('submit', function(e){
        e.preventDefault();
        console.log(this);
        console.log($(this));
        console.log($(this)[0])
        var formData = new FormData($(this));

        $.ajax({
            //this is the php file that processes the data and send mail
            url: "<?php echo base_url();?>faculty/edit_member",
            //GET method is used
            type: "POST",
            async: false,
            cache: false,
            contentType: false,
            processData: false,
            //success
            dataType: "json",
            success: function (data, $textStatus, $asdf) {
                console.log(data);

                if(data.status)
                    $.growlUI('Success', 'Permission Edited!');
                $( "#edit-permission-form" ).dialog( "close" );
            },
            error: function (data, textStatus, errorThrown) {
                console.log(data);
                console.log('error');
            }
        });

    });

    $('#upload_photo').on('change', function(event){
       //console.log($(this).val().split(/(\\|\/)/g).pop());
        $('#p_filename').html($(this).val().split(/(\\|\/)/g).pop())
    });
</script>
